<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>ueditor图片对话框</title>
    <!-- image dialog -->
    <link rel="stylesheet" href="../image/image.css" type="text/css" />
</head>
<body>

    <div class="wrapper">
        <div id="tabhead" class="tabhead">
            <span class="tab focus" data-content-id="remote"><var id="lang_tab_remote"></var></span>
        </div>
        <div class="alignBar">
            <label class="algnLabel"><var id="lang_input_align"></var></label>
                    <span id="alignIcon">
                        <span id="noneAlign" class="none-align focus" data-align="none"></span>
                        <span id="leftAlign" class="left-align" data-align="left"></span>
                        <span id="rightAlign" class="right-align" data-align="right"></span>
                        <span id="centerAlign" class="center-align " data-align="center"></span>
                    </span>
            <input id="align" name="align" type="hidden" value="none"/>
        </div>
        <div id="tabbody" class="tabbody">
            <!-- 远程图片 -->
            <div id="remote" class="panel focus">
                <div class="top">
                    <div class="row">
                        <label for="url"><var id="lang_input_url"></var></label>
                        <span><input class="text" id="url" type="text"/></span>
                    </div>
                </div>
                <div class="left">
                    <div class="row">
                        <label><var id="lang_input_size"></var></label>
                        <span><var id="lang_input_width">&nbsp;&nbsp;</var><input class="text" type="text" id="width"/>px </span>
                        <span><var id="lang_input_height">&nbsp;&nbsp;</var><input class="text" type="text" id="height"/>px </span>
                        <span><input id="lock" type="checkbox" disabled="disabled"><span id="lockicon"></span></span>
                    </div>
                    <div class="row">
                        <label><var id="lang_input_border"></var></label>
                        <span><input class="text" type="text" id="border"/>px </span>
                    </div>
                    <div class="row">
                        <label><var id="lang_input_vhspace"></var></label>
                        <span><input class="text" type="text" id="vhSpace"/>px </span>
                    </div>
                    <div class="row">
                        <label><var id="lang_input_title"></var></label>
                        <span><input class="text" type="text" id="title"/></span>
                    </div>
                </div>
                <!--start-->
                <div class="container">
                    <form class="form-horizontal" id="form1">
                        <div class="form-group" id="upload1">
                            <!--<div class="col-xs-9" style="display: none">-->
                            <!--<span>-->
                            <!--图片地址-->
                            <!--</span>-->
                            <!--<input type="text" class="form-control" id="photo" name="photo" readonly style="background-color: white">-->
                            <!--</div>-->
                            <div class="col-xs-9 col-xs-offset-3">
                                <span class="label label-default ">文件:</span> <span id="file-text" style="color: red">未选择图片</span><br>
                                <button class="btn btn-primary btn-sm" style="margin-top: 10px" id="upLoadUediorIMGBtn" type="button">添加图片</button>
                                <!--<button class="btn btn-default btn-sm" id="upload-btn" type="button">上传图片</button>-->
                            </div>
                            <div class="col-xs-9 col-xs-offset-3 area" style="margin-top: 10px;display: none">
                                <div class="progress">
                                    <div id="upload-progress" class="progress-bar" role="progressbar" aria-valuenow="0"
                                         aria-valuemin="0" aria-valuemax="100" style="min-width: 2em;">
                                        0%
                                    </div>
                                </div>
                            </div>
                            <div class="col-xs-9 col-xs-offset-3 area" style="margin-top: 10px;display: none">
                                <span class="label label-danger ">提示</span> <span id="error-text" style="color: red">请先选择文件</span>
                            </div>
                        </div>
                    </form>
                </div>
                <!--end-->
                <div class="right"><div id="preview"></div></div>
            </div>
        </div>
    </div>

    <!-- jquery -->
    <script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="../image/image.js"></script>
    <script src="https://lib.rxjy.com/element-rx/static/components/layer/dist/layer.js"></script>
    <script type="text/javascript" src="../internal.js?v=201903041012"></script>
    <!--plupload上传文件-->
    <script type="text/javascript" src="https://tedu.rxjy.com/static/plupload-2.3.6/js/plupload.full.min.js?v=201903041012"></script>
    <script type="text/javascript" src="https://tedu.rxjy.com/static/plupload-2.3.6/js/upload-edu.js?v=201903041012"></script>
    <script>
        $(function () {
            var yunOssUrl="https://oss.rxjy.com/invest01";
            //调用上传图片方法
            upload({
                // 上传控件ID
                id: "upLoadUediorIMGBtn",
                //上传文件服务器地址
                serverUrl:yunOssUrl+"/getOSSToken",
                //上传文件key
                key:"company/",
                // 是否传多个文件
                mutil: false,
                // 上传文件类型
                mime_types: [{title: "Image files", extensions: "jpg,gif,png,bmp"}],
                //上传限制大写
                max_file_size:'30mb',
                // 上传成功后回调函数
                callback: function (file,up,url) {
                   var imgUrl =  url+"?x-oss-process=image/resize,l_800";//图片地址
                    $("#url").val(imgUrl);
                    $("#preview").empty().append('<img src="'+imgUrl+'" width="260px"  border="0px solid #000" title="">');
                    $("#upload1 #file-text").text(file.name + ' (' + file.size + ')');
                    $("#upload1 #upload-progress").parents(".area").hide();
                    $("#upload1 #error-text").parents(".area").hide();
                    layer.msg("添加成功！", {time: 1000, icon: 6});
                },
            });
        });
    </script>
</body>
</html>
